<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>浮动</title>
		<link href="css/Fstyle.css" rel="stylesheet">
	</head>
	<body>
		<!-- 传统的网页布局：标准流+浮动+定位 -->
		<!-- 
		网页布局第一准则：多个块级元素纵向排列找标准流，多个块级元素横向排列找浮动。
		标准流+浮动布局策略：父级用标准流排列上下位置，内部子元素用浮动排列左右位置。
		 -->
		<!-- 
		快速创建多个标签：标签名*个数>tab键
		 快速创建多个类名叫box的标签：标签名.类名*个数>tab键
		 快速创建多个类名叫box的div：.box*个数>tab键
		 -->
		 <div class="bigbox clearfix">
			<div class="box">1</div>
			<div class="box" style="height: 310px;">2</div>
			<div class="box" style="height: 180px;">3</div>
			<div class="box" style="height: 100px;">4</div>
		</div>
		<div class="box1">hello box</div>
	</body>
</html>
